<!DOCTYPE html>
<html lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- Bootstrap -->
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css" rel="stylesheet">
    <!-- jQuery (Bootstrap 的所有 JavaScript 插件都依赖 jQuery，所以必须放在前边) -->
    <script src="https://cdn.jsdelivr.net/npm/jquery@1.12.4/dist/jquery.min.js"></script>
    <!-- 加载 Bootstrap 的所有 JavaScript 插件。你也可以根据需要只加载单个插件。 -->
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script>
    <!-- 工具 -->
    <script src="js/HttpUtil.js"></script>
<!--    <script src="${pageContext.request.contextPath}/js/DatePicker.js"></script>-->
    <title>商品添加页面</title>
</head>
<body>
<div class="row" style="margin-left: 20px;">
<!--    <form>-->
        <div>
            <h3>新增商品</h3>
        </div>
        <hr/>
        <div class="row">
            <div class="col-sm-6">
                <div class="form-group form-inline">
                    <label>名称:</label>
                    <input id="goodsName" type="text" name="goodsName" class="form-control"/>
                </div>

                <div class="form-group form-inline">
                    <label>分类:</label>
                    <select name="t_id" class="form-control" id="sel_type">
<!--                        <option value="0">&#45;&#45;请选择&#45;&#45;</option>-->
                    </select>
                </div>
<!--                <div class="form-group form-inline">-->
<!--                    <label>时间:</label>-->
<!--                    <input type="text" name="p_time" readonly="readonly" class="form-control" onclick="setday(this)"/>-->
<!--                </div>-->
            </div>
            <div class="col-sm-6">
                <div class="form-group form-inline">
                    <label>价格:</label>
                    <input id="price" type="text" name="p_price" class="form-control"/>
                </div>
                <div class="form-group form-inline">
                    <label>评分:</label>
                    <input id="grade" type="text" name="p_state" class="form-control"/>
                </div>
            </div>
        </div>
        <div class="row">
            <div class="col-sm-10">
                <div class="form-group form-inline">
                    <label>商品图片</label>
                    <div class="item">
                        <span>上传附件</span>
                        <input type="file" name="files" class="form-control" id="file" multiple="multiple" >
                    </div>
<!--                    <input type="file" name="files" class="form-control" id="file" multiple="multiple" >-->
<!--                    <label>商品图片</label>-->
<!--                    <input type="file" name="p_image" id="img2"/>-->
<!--                    <label>商品图片</label>-->
<!--                    <input type="file" name="p_image" id="img3"/>-->
<!--                    <label>商品图片</label>-->
<!--                    <input type="file" name="p_image" id="img4"/>-->
                </div>
                <div class="form-group ">
                    <label>商品简介</label>
                    <textarea id="info" name="p_info" class="form-control" rows="5"></textarea>
                </div>
                <div class="form-group form-inline">
                    <input type="submit"onclick="addGoods()" value="添加" class="btn btn-primary"/>
                    <input type="reset"  value="重置" class="btn btn-default"/>
                </div>
            </div>
        </div>
<!--    </form>-->
</div>
<script>
    $(document).ready(function(){
        // loadGoods();
        loadType();
    });
    function loadType(){
        //ajax 请求后台
        var url="adminGoods/select";
        url=appendHost(url);
        $.ajax({
            url:url,
            method:"post",
            success:function (resp) {
                handleResp(resp,function (res) {
                    console.log("showGoodsType")
                    console.log(res);
                    var html = res.map(function (g) {
                        var template =
                            `<option value="${g.id}">-- ${g.typeName} --</option>`;
                        return template
                    }).join("");
                    $("#sel_type").html(html);
                    // loadGoods(res);
                });
            },
            error:function(XMLHttpRequest,textStatus,errorThrown){
                alert("失败"+XMLHttpRequest.status+":"+textStatus+":"+errorThrown);
            }
        });
    }
    //添加商品
    function addGoods() {
        if (confirm("确认要添加商品吗?")) {
            //添加附件start
            var formData = new FormData();
            for(var i=0;i<$("#file")[0].files.length;i++) {  //循环获取上传个文件
                formData.append("file", $("#file")[0].files[i]);
            }
            // formData.append("bid",bid);//此处可以添加一个参数和图片一起上传
            var url="adminGoods/upload";
            url=appendHost(url);
            $.ajax({
                url: url,
                data : formData,
                dataType:"json",
                type: "post",
                contentType : false, //上传文件一定要是false
                processData:false,
                success: function(obj) {
                    console.log(obj);
                    console.log(obj.data);
                    let url = "adminGoods/add";
                    let params = {
                        goodsName:$("#goodsName").val(),
                        typeId:$("#sel_type").find("option").val(),
                        price:$("#price").val(),
                        imageUrl:(obj.data),
                        grade:$("#grade").val(),
                        info:$("#info").val()
                    };
                    console.log("adminGoods/add");
                    console.log(params);
                    httpPost(url, params, function () {
                        alert("添加商品成功");
                        loadType();
                    });
                    // if (obj.code == 0) {
                    //     layer.alert("上传成功！");
                    // }else{
                    //     layer.alert(obj.message);
                    // }
                }
            });
            //添加附件end
















            //处理成功后动作，比如调
        }

    }
</script>
</body>
</html>